import React, { Component } from 'react';
import './yangshi/payment.scss';
class Com extends Component {
    render () {
        return (
            <div className="container">
                <div className='box'>
                    <div className="content">
                        {/* 取货方式 */}
                        <div className="preview-section">
                            <div className="address-box" data-address-id="925637">
                                <span className="icondizhi iconfont icon-goods-location"></span>
                                <div className="address-detail">
                                    <div className="buyer-name-box">
                                        <span className="store-config-label">快递</span>
                                        <span className="buyer-name">请问</span>
                                        <span>12341231234</span>
                                    </div>
                                    <div className="buyer-address">广东省深圳市南山区粤海街道深南大道深南花园</div>
                                </div>
                                <div className="iconfont iconyoujiantou icon-rightarrow"></div>
                            </div>
                        </div>
                        <div className="address-bg">
                            <img src="http://cdn.jisuapp.cn/static/webapp/images/xcx-goods/goods-address-bg.png" />
                        </div>
                        {/* 商品 */}
                        <div className="preview-goods-order-list">
                            <div className="preview-goods-order-item">
                                <img className="preview-goods-cover" src="https://img.zhichiwangluo.com/5df85016a7a37tmp_f3f5804d8ef52581188d66685ae8e0ae85d98b4bd4f62833.jpg" mode="aspectFill" />
                                <div className="preview-goods-content">
                                    <div className="preview-goods-title">万宝路麦丽素</div>
                                    <div className="goods-price-box">
                                        <span className="preview-goods-price">¥27.00</span>
                                        <div className="good-number-box pull-right">
                                            <div className="goods-minus changenum" data-index="0">-</div>
                                            <input className="goods-count changenum" data-index="0" type="number"/>
                                            <div className="goods-plus changenum" data-index="0">+</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {/* 金额和运费 */}
                        <div className="preview-box">
                            <div className="single-box">商品金额
                                <span className="pull-right">¥ 15.00</span>
                            </div>
                            <div className="single-box">运费
                                <span className="pull-right">¥ 6.00</span>
                            </div>
                        </div>
                        {/* 买家留言 */}
                        <div className="preview-box">
                            <div className="buyer-message single-box">买家留言
                                <div className="pull-right">
                                    <input className="remark" placeholder="买家留言"/>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <footer className="foot-payment">
                    <div className="preview-goods-total-price">合计:
                        <span className="price-count">¥ 33.00</span>
                    </div>
                    <form>
                        <button type="button">在线支付</button>
                    </form>
                </footer>
            </div>
        )
    }
}
export default Com